<template>
  <view class="login-enter">
    <view>
      <!-- <u-input
        v-model="loginForm.phone"
        type="text"
        :border="border"
        clearable
        trim
        height="90"
        placeholder="请输入手机号码"
      /> -->
      <u-field
        v-model="loginForm.phone"
        label-width="0"
        label=""
        placeholder-style="color:#c0c4cc"
        placeholder="请输入手机号码"
      >
        <template slot="icon">
          <u-icon
            name="shouji"
            custom-prefix="custom-icon"
            color="#c0c4cc"
            :size="28"
          ></u-icon>
        </template>
      </u-field>
    </view>
    <view class="u-m-t-20">
      <u-field
        v-model="loginForm.code"
        label-width="0"
        label=""
        placeholder-style="color:#c0c4cc"
        placeholder="请输入短信验证码"
      >
        <template slot="icon">
          <u-icon
            name="yanzhengma"
            custom-prefix="custom-icon"
            color="#c0c4cc"
            :size="28"
          ></u-icon>
        </template>
        <u-button size="mini" slot="right" type="success" @click="getCode">{{
          codeText
        }}</u-button>
      </u-field>
    </view>
    <view class="u-m-t-20">
      <u-field
        v-model="loginForm.password"
        label-width="0"
        label=""
        :password="true"
        placeholder-style="color:#c0c4cc"
        placeholder="请输入密码"
      >
        <template slot="icon">
          <u-icon
            name="ziyuanxhdpi"
            custom-prefix="custom-icon"
            color="#c0c4cc"
            :size="28"
          ></u-icon>
        </template>
      </u-field>
    </view>
    <view class="u-m-t-20">
      <u-field
        v-model="loginForm.password2"
        label-width="0"
        label=""
        :password="true"
        placeholder-style="color:#c0c4cc"
        placeholder="请确认密码"
      >
        <template slot="icon">
          <u-icon
            name="ziyuanxhdpi"
            custom-prefix="custom-icon"
            color="#c0c4cc"
            :size="28"
          ></u-icon>
        </template>
      </u-field>
    </view>
    <view class="u-m-t-40">
      <u-button type="primary" shape="circle">确定</u-button>
    </view>
  </view>
</template>
<script lang="ts" setup>
const border = ref(false);
const codeText = ref('获取验证码');
const getCode = () => {};
const loginForm = reactive({
  phone: '',
  password: '',
  password2: '',
  code: '',
});
</script>
<style lang="scss">
page {
  width: 100%;
  height: 100%;
}
.login-enter {
  padding: 40rpx;

  .u-field {
    background: rgba(255, 255, 255, 0.8) !important;
    border-radius: 45rpx !important;
  }
}
</style>
